<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>ajaxStart 以及Ajax的错误码处理</title>
    <script  type="text/javascript" src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.js"></script>
    <style>
        .loading{
            display: none;
            color: darkred;
        }
    </style>
</head>
<body>
<input type="button" id="demo" value="load加载数据">
<form>
    <input id="age" name="age" value="">
</form>
<div id="box"></div>
<span class="loading">正在加载中......</span>
<script>
    var AJAXURL = "__APP__/Home/Jquery/";
    $(document).ready(function ()
    {
        $("#demo").bind('click',function(){
            var url = AJAXURL+'startData';
            var data = {
                'username' : 'wanwan',
                'age' : $('#age').val()
            };
            $.ajax({
                type: 'POST',
                url : url,
                data : data,
                success:function(response, status, xhr){
                    $("#box").html(response);
                },
                timeout: 50000,
                error:function(xhr, errorText, errorStatus){
                    alert(xhr.status + ':' + xhr.statusText);
                },
                complete:function(xhr, status){
                    alert('完成' + ' - ' + xhr.responseText + ' - ' + status);
                },
                beforeSend:function (xhr, settings) {
                    alert('请求之前' + ' - ' + xhr.readyState + ' - ' + settings.url);
                }
            });
        });

        // 请求开始，其他请求为完成时，激活ajaxStart()函数。所有的请求事件结束的时候，停止时：记过ajaxStop()
        $(document).ajaxStart(function(){
            $(".loading").show();
        }).ajaxStop(function(){
            $(".loading").hide();
        });


    });
</script>
</body>
</html>